<template>
  <AppContainer class="w80p">
    <el-row>
      <el-col :span="20">
        <el-form ref="form" :model="form" :rules="rules" label-width="180px">
          <el-card header="店铺设置" class="mb10">
            <el-form-item label="超时付款失败" prop="timeout">
              <el-input
                v-model="form.timeout"
                placeholder="请输入超时付款失败"
              />
            </el-form-item>
            <el-form-item label="网站域名:" prop="storeName">
              <el-input
                v-model="form.storeName"
                type="textarea"
                placeholder="请输入域名,多个用英文逗号隔开比如:aa.com,bb.com"
              />
            </el-form-item>
          </el-card>
          <el-card header="后台设置">
            <el-form-item label="自动拒绝卡头" prop="refuseCards">
              <el-input
                v-model="form.refuseCards"
                type="textarea"
                placeholder="请输入内容"
              />
            </el-form-item>
            <el-form-item label="自动高亮卡头" prop="highlightCards">
              <el-input
                v-model="form.highlightCards"
                type="textarea"
                placeholder="请输入内容"
              />
            </el-form-item>
            <el-form-item label="文件写入" prop="btFile">
              <el-select
                v-model="form.btFile"
                placeholder="请选择文件写入1写入 0不写入"
              >
                <el-option
                  v-for="dict in dict.type.open_status"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="后台刷新频率" prop="refreshRate">
              <el-input
                v-model="form.refreshRate"
                placeholder="请输入后台刷新频率"
              />
            </el-form-item>
            <el-form-item label="拒绝重复卡号" prop="repeatRejection">
              <el-select
                v-model="form.repeatRejection"
                placeholder="请选择拒绝重复卡号1是 0否"
              >
                <el-option
                  v-for="dict in dict.type.open_status"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="永久显示更多操作按钮" prop="tgOpen">
              <el-switch
                v-model="form.tgOpen"
                active-color="#13ce66"
                :active-value="1"
                :inactive-value="0"
                inactive-color="#ff4949"
              >
              </el-switch>
            </el-form-item>
            <el-form-item label="是否开启轮询播报" prop="tgMsg">
              <el-switch
                v-model="form.tgMsg"
                active-color="#13ce66"
                active-value="1"
                inactive-value="0"
                inactive-color="#ff4949"
              >
              </el-switch>
            </el-form-item>
            <!-- <el-form-item label="卡信息查询" prop="refreshRate">
              <el-input
                v-model="cardNumber"
                @blur="onCheckCard"
                placeholder="请输入卡"
              />
            </el-form-item> -->
          </el-card>
        </el-form>
      </el-col>
    </el-row>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm">确 定</el-button>
    </div>
  </AppContainer>
</template>

<script>
import { addDyConfig, updateDyConfig,checkCard } from "@/api/system/dyConfig";
import { mapActions } from "vuex";

export default {
  name: "DyConfig",
  dicts: ["open_status"],
  data() {
    return {
      form: {
        id: 1,
        tgOpen: 0,
      },
      cardNumber:'',
      // 表单校验
      rules: {},
    };
  },
  mounted() {
    this.getAppConfig({ id: 1 }).then((response) => {
      this.form = response.data;
    });
  },
  methods: {
    ...mapActions("app", ["getAppConfig"]),
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.id != null) {
            updateDyConfig(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.getAppConfig({ id: 1 });
            });
          } else {
            addDyConfig(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    async onCheckCard(){
      const res = await checkCard({
        cardNumber:this.cardNumber
      })
      console.log(res)
    },
    // getInfo() {
    //   getDyConfig(this.form.id).then((response) => {
    //     this.form = response.data;
    //     this.title = "修改系统配置";
    //   });
    // },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "system/dyConfig/export",
        {
          ...this.queryParams,
        },
        `dyConfig_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>
